<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="jquery-1.7.2.min.js"></script>
		<script>
			$(function(){
//				click绑定事件的方式,不支持未来元素
//				$('ul li').click(function(){
//					alert($(this).html());
//				})
//				通过live可以给未来元素绑定事件
//				$('ul li').live('click',function(){
//					alert($(this).html());
//				})
//				通过事件委托,给未来元素绑定事件
				$('ul').delegate('li','click',function(){
					alert($(this).html());
				})
				
				$('input').click(function(){
					//用jq创建元素的方法 $('<div>123</div>');
					//document.createElement(标签名)
//					用jq创建出来的对象,以$开头命名
					$li = $('<li>new</li>');//学名：未来元素
					$('ul').append($li);
				})
			})
		</script>
	</head>
	<body>
		<input type="button" value="创建li" />
		<ul>
			<li>111</li>
			<li>222</li>
			<li>333</li>
			<li>444</li>
			<li>555</li>
		</ul>
	</body>
</html>
